'use client'

import { useEffect, Suspense } from 'react'
import { usePathname, useSearchParams } from 'next/navigation'

function ScrollToTopInner() {
  const pathname = usePathname()
  const searchParams = useSearchParams()

  useEffect(() => {
    // 检查URL中是否有锚点
    const hash = window.location.hash

    if (hash) {
      // 如果有锚点，尝试滚动到对应元素
      setTimeout(() => {
        const element = document.querySelector(hash)
        if (element) {
          element.scrollIntoView({ behavior: 'smooth' })
        } else {
          // 如果找不到锚点元素，滚动到顶部
          window.scrollTo(0, 0)
        }
      }, 100) // 延迟一点确保DOM已渲染
    } else {
      // 没有锚点时，直接滚动到顶部
      window.scrollTo(0, 0)
    }
  }, [pathname, searchParams])

  return null
}

export function ScrollToTop() {
  return (
    <Suspense fallback={null}>
      <ScrollToTopInner />
    </Suspense>
  )
}
